<template>
    <div>
        <div class="footerAll">
            <div class="middleCenter">
                <div class="helpfulHints">友情链接</div>
                <div class="sponsors">
                    <ul >
                        <li v-for="(item,index) in list" :key="index" ><a :href="item.dictValue" id="aaa">{{item.dictLabel}}</a></li>

                    </ul>
                </div>
                <div class="horizontalLine"></div>
                <div class="record">Copyright © 2017-2025 石家庄天亮教育科技有限公司 备案号:冀ICP备17020003号</div>
            </div>
        </div>
    </div>
</template>

<script>
    import {getfriend} from "../api/api";

    export default {
        name: "Footer.vue",
        data(){
          return {
              list:[]
          }
        },
        created() {
            getfriend().then(res=>{
                console.log(res)
                this.list=res.rows
            })
        }
    }
</script>

<style scoped lang="less">
    .footerAll {
        width: 100%;
        height: 200px;
        overflow: hidden;
        background-color: #444546;

        .middleCenter {
            width: 1200px;
            height: 200px;
            margin: 0 auto;
            overflow: hidden;

            .helpfulHints {
                height: 30px;
                font-size: 22px;
                margin: 16px 0px;
                color: #999;
            }

            .sponsors ul {
                height: 40px;

                li {
                    height: 40px;
                    float: left;
                    color: #999;
                    margin-right: 30px;
                    list-style: none;
                    a {
                        color: #999999;
                    }
                }
            }

            .horizontalLine {
                width: 1000px;
                height: 1px;
                margin: 0 auto;
                overflow: hidden;
                border-bottom: 1px solid #ccc;
            }

            .record {
                width: 1000px;
                height: 30px;
                overflow: hidden;
                margin: 10px auto;
                text-align: center;
                line-height: 30px;
                color: #999;
            }
        }
    }
    #aaa:hover {
        color: #00CF8C;
    }

</style>